<template>
<div class="ui form">
    <div class="inline fields" v-show='!bind_hide'>
        <div class="field">
            <div class="ui radio checkbox" v-for='{label,value} in radioBind'>
                <input type="radio" v-model='submitData.is_qucik_bind' :value='value'>
                <label>{{label}}</label>
            </div>
        </div>
    </div>
	<tFields @onsubmit="onsubmit" @oncancel="oncancel" @onchange="onchange" :data="normal_base_fileds" v-show="fileds_name=='normal_base_fileds'" :nosubmit='nosubmit'></tFields><br>
    <tFields @onsubmit="onsubmit" @oncancel="oncancel" @onchange="onchange" :data="qucik_fileds" v-show="fileds_name=='qucik_fileds'" :nosubmit='nosubmit'></tFields><br>
    <div class="field" v-show='fileds_name=="normal_fwz_fileds"'>
        服务者：<button class="ui secondary button " @click.stop.prevent='addFWZ()'>添加</button>
    </div>
	<FWZList v-show='fileds_name!="normal_base_fileds"' @reload='getFWZList(params.scode)' :list='FWZListData' :params='params'></FWZList>
	<button class="ui secondary button " v-show='fileds_name=="normal_base_fileds"' @click.stop.prevent='saveAndbindFWZ'>保存并绑定服务者 </button>
	<!-- <button class="ui secondary button " v-show='fileds_name=="normal_fwz_fileds"' @click.stop.prevent='saveNormal'>保存</button> -->
	<button class="ui secondary button " v-show='fileds_name=="qucik_fileds"' @click.stop.prevent='saveQucik'>保存</button>
    <button class="ui  button "  @click.stop.prevent='oncancel'>{{fileds_name=='normal_base_fileds'?'取消':'返回'}}</button>
</div>
</template>
<script>
import tool from 'src/util/tool';
import util from '_util/index';
import logic from '_logic';

import tTable from 'components/tunit/tTable';
import tFields from 'components/tunit/tFields';
import FWZList from './FWZList'

// import latlonMap from 'components/tunit/tmodel/latlonMap';

export default {
    data() {
        return {
            nosubmit: true,
			submitData:{
				pid:'',//会话商品id
				hotel_id:'',//场景id
				is_qucik_bind:'0',//是否快速绑定
				tzu_id:'',//服务者id
				model_scode:''//模板渠道码
			},
			bind_hide:false,
            radioBind: [{
                    value: '0',
                    label: '普通绑定'
                },
                {
                    value: '1',
                    label: '快速绑定'
                }
            ],
            fileds_name: 'normal_base_fileds',
			FWZListData:[],
            normal_base_fileds: [{
                    label: "会话",
                    show_type: "bind",
                    name: "pid",
					//"bindModel": 23,
                    "bindModel": 170,
                    "data_type": 1,
                    "bind_type": 0,
					bind_name_field:"chat_product",
                    value: ''
                },
                {
                    label: "场景",
                    show_type: "bind",
                    name: "hotel_id",
                    "bindModel": 1,
                    "data_type": 1,
                    "bind_type": 0,
					bind_param:`isSearch=1`,
					bind_name_field:"hotel_name",
                    value: ''
                }
            ],
			qucik_fileds: [{
                    label: "模板渠道码",
                    show_type: "input",
                    name: "model_scode",
                    // "bindModel": 37,
                    // "data_type": 1,
                    // "bind_type": 0,
					// bind_name_field: 'chn_id',
					// 'bind_param': 'bind_all=1',
                    value: ''
                },
				{
					bindModel: 15,
					show_type: "bind",
					name: 'tzu_id',
					bind_type: 1,
					label: '服务者',
					bind_name_field: 'name',
					bind_param:`type=1&isSearch=1`,
					search_field:'name'
				}
            ],
        }
    },
    computed: {
    },
    components: {
        tTable,
        tFields,
		FWZList
    },
    watch: {
		'submitData.is_qucik_bind':function(value){
			this.fileds_name = '';
			this.fileds_name = value==1?'qucik_fileds':'normal_base_fileds';
			this.$emit("onchange", {
				name:'is_qucik_bind',
				data:value
			});
		}
	},
    methods: {
        onclickBtn({
            type,
            rowIndex,
            tableName
        }) {

        },
		saveNormal(){},
		saveQucik(){
			let _this = this
			util.http.SR(this, '/index/Op/add_qd', _this.params, '保存成功', (rs) => {
				_this.oncancel()
			});
		},
		getFWZList(scode){
			let _this = this
			util.http.getDataCom(_this, '/index/Op/get_qdcodetz', {
				scode
			},(rs) => {
				_this.FWZListData = rs;
				_this.fileds_name = 'normal_fwz_fileds'
			})
		},
        addFWZ() {
			let _this = this;
			util.store.push(this, 'set_in_modal','in_modal',false,true,'global');
			util.store.get(this,'eventVue').$emit('showPopCom', {
				_this: this,
				id: this.$route.query.top_mid,
				data: {
					fn: {
						sure: function(data) {
							let ids = JSON.parse(data.id)
							let names = data.name.split('#|#');
							util.http.SR(_this, '/index/Op/add_qdcodetz', {
								scode:_this.params.scode,
								tzu_id:ids.join('|'),

							}, '添加成功', (rs) => {
								_this.getFWZList(_this.params.scode)
							});
						}
					},
					field: {
						bindModel: 15,
						bind_type: 1,
						title: '添加服务者',
						name: 'id',
						bind_name_field: 'name',
						bind_param:`type=1&isSearch=1`,
						search_field:'name'
					}
				},
				hide_in_model:true,
				name: 'Jbind'
			});
        },
		initData(){
			Object.keys(this.submitData).forEach(item=>{
				this.submitData[item] = this.params[item]
			})
			this.normal_base_fileds.forEach(item=>{
				if(item.show_type == 'bind'){
					let f = this.params[item.name]
					item.value = Array.isArray(f)?f.join('|'):f
				}else{
					item.value = this.params[item.name]
				}
			})
			this.qucik_fileds.forEach(item=>{
				item.value = this.params[item.name]
			})
			let str = this.params.hotel_id+this.params.pid;
			if(this.op == 'update'&&str.length>0){
				this.submitData.is_qucik_bind = '0';
				this.bind_hide = true
			}else {
				this.submitData.is_qucik_bind = this.params.is_qucik_bind || 0
			}
		},
        saveAndbindFWZ() {
			let _this = this
			util.http.SR(this, '/index/Op/add_qd', _this.params, '保存成功', (rs) => {
				if(_this.params.name.length>0&&_this.params.uname.length>0){
					_this.$emit("onchange", {
						name:'id',
						data:rs.id
					});
					_this.$emit("onchange", {
						name:'scode',
						data:rs.scode
					});
					_this.getFWZList(_this.params.scode)
				}
			});

        },
        onchange({
            name,
            value
        }) {
			value = Array.isArray(value)?value.join('|'):value
			this.submitData[name] = value;
			this.$emit("onchange", {
				name:name,
				data:value
			});
        },
        onsubmit(form) {

        },
        oncancel() {
			this.$router.go(-1);
			return;
        },
    },
    props: {
        params: {
            type: Object,
            default: function() {
                return {}
            }
        },
        op: '',
    },

    created() {
		this.initData()
	},
}
</script>
<style scoped lang="less">
@import "../../../common/style/mixin";

.ui.form .filed {
    margin-bottom: 10px;
}

.ui.table {
    width: auto;
}

.search-items {
    max-height: 100px;
    width: 250px;
    border: 1px solid rgba(34, 36, 38, .1);
    overflow: auto;
    padding: 0;
    &-item {
        margin: 0;
        padding: 0;
        list-style: none;
        padding: 10px;
        font-size: 12px;
        &:hover {
            background-color: rgba(34, 36, 38, .1);
        }
    }
}
</style>
